import React, {
	Component
} from 'react';
import {
	List,
	InputItem,
} from "weaver-mobile";

export default class Input extends Component {
	handleChange = (index, value) => {
		const {
			store
		} = this.props;

		const types = ['old', 'new', 'confirm', 'verificationCode'];

		store.setPassword(types[index], value);
	}

	render() {
		const {
			placeholder,
			index,
			value,
		} = this.props;

		return (
			<List>
				<InputItem
					clear
					value={value}
					type={(index !== 3) ? 'password' : 'text'}
        			placeholder={placeholder}
        			onChange={this.handleChange.bind(value,index)}
      			/>
			</List>
		)
	}
}